<template>
  <a-drawer :open="visible" title="移位单详情" @close="onClose">
    <template #closeIcon>
      <close @on-close="onClose" />
    </template>
    <template #extra>
      <a-space :size="5">
        <span>{{ options.no }}</span>
        <span>{{ options.dealer?.name }}</span>
        <span>{{ options.create_time }}</span>
        <a-button type="link" @click="changeLogModal(true)">查看日志</a-button>
      </a-space>
    </template>
    <a-card size="small" title="基本信息">
      <a-descriptions size="small" :column="3">
        <a-descriptions-item label="移货单号">{{ options.no }}</a-descriptions-item>
        <a-descriptions-item label="经销商">{{ options?.dealer?.name }}</a-descriptions-item>
        <a-descriptions-item label="来源仓库"
          >{{ options.startWarehouse?.name }}({{ getDescByValue('WAREHOUSE_ATTRIBUTE_TYPE', options.startWarehouse?.attribute_type) }})<span v-if="options.startWarehouseLocation">({{ options.startWarehouseLocation?.code }})</span></a-descriptions-item
        >
        <a-descriptions-item label="目标仓库"
          >{{ options.endWarehouse?.name }}({{ getDescByValue('WAREHOUSE_ATTRIBUTE_TYPE', options.endWarehouse?.attribute_type) }})<span v-if="options.endWarehouseLocation">({{ options.endWarehouseLocation?.code }})</span></a-descriptions-item
        >
        <a-descriptions-item label="商品数量">{{ options.order_number }}</a-descriptions-item>
        <a-descriptions-item label="商品货值">{{ options.detail_sum }}</a-descriptions-item>
        <a-descriptions-item label="移货时间">{{ options.create_time }}</a-descriptions-item>
      </a-descriptions>
    </a-card>
    <a-card class="smart-margin-top10" size="small" title="商品明细">
      <ShiftGoodsTable :dataSource="options.detail" />
    </a-card>
    <LogModal v-model:open="showLogModal" @close="changeLogModal(false)" :tableData="options.relatedLog" />
    <template #footer>
      <a-button @click="onClose">取消</a-button>
    </template>
  </a-drawer>
</template>

<script setup lang="ts">
import ShiftGoodsTable from './shift-goods-table.vue'
import { useEnums } from '@/hooks/plugins/useEnums'
import { movingOrderApi } from '@/api/business/storage/shift-api'
import { message } from 'ant-design-vue'
import { errorSentry } from '@/lib/error-sentry'
import { useLoadingStore } from '@/store/modules/loading-store'
const loadingStore = useLoadingStore()
const { getDescByValue } = useEnums()

defineExpose({
  showDrawer
})
const emit = defineEmits(['refresh'])

// --------------------- Drawer 显示与隐藏 ---------------------
// 是否展示
const visible = ref(false)
// 详情
const options = ref({})

function showDrawer(item) {
  singleDetail(item)
  visible.value = true
}

// 详情
async function singleDetail(rowData) {
  try {
    loadingStore.show()
    const res = await movingOrderApi.detailMovingOrder({ id: rowData.id })
    options.value = res.data
  } catch (e) {
    if (e.msg) {
      message.error(e.msg)
    }
    errorSentry.captureError(e)
  } finally {
    loadingStore.hide()
  }
}

const onClose = () => {
  visible.value = false
}

const showLogModal = ref(false)
function changeLogModal(status: boolean) {
  showLogModal.value = status
}
</script>
